<template>
    <div id="topicdetail">
        
        <!-- 标题 -->
        <div class="topicdetail-top">{{topicdetail.title}}</div>

        <img :src="topicdetail.pic" alt="" width="100%" height="100%">
        <div v-html="topicdetail.content" class="topicdetail-body"></div>
        
    </div>
</template>

<script>
export default {
    data() {
        return {
            topicdetail:[],   // 详情数据
        }
    },
    mounted() {
        console.log(this.$route.query.id);

        let id = this.$route.query.id;
        console.log(id);
        // 精选专题 详情 \ 文章详情
        this.$API.topdetail(id).then((res)=>{
            console.log(res.data.data);
            this.topicdetail = res.data.data;
        }).catch((error)=>{
            console.log(error);
        });
    },
}
</script>

<style lang="scss">
#topicdetail{
    width:100%;
    .topicdetail-top{
        text-align: center;
        font-size: 0.4rem;
        margin:0.25rem 0;
    }
    .topicdetail-body{
        font-size: 0.3rem;
        text-indent: 0.5rem;
    }
}
</style>